<template lang="html">
    <div class="">
            <logo></logo>
            <p>login</p>
            <div class="cell-wrapper">
                <mt-fiel label="用户名" type="tel"  placeholder="请输入用户名" v-model="userName"></mt-fiel>
                <mt-fiel label="密码" placeholder="请输入密码" type="password" v-model="userPassword"></mt-fiel>
            </div>
            <div class="page-msgbox-wrapper">
                <mt-button @click.native="login" type="primary" size="large"> 登录</mt-button>
                <p class="whitespace"></p>
                <mt-button @click.native="register" type="primary" size="large"> 注册</mt-button>
            </div>
            <!-- <p>{{isAuth}}</p> -->
    </div>
</template>

<script>
import Logo from '@/components/logo/Logo'
import {
	Field,
	Button,
	Toast
} from 'mint-ui';


export default {
	data() {
		return {
			userName: '',
			userPassword: '',
			userLength: false


		}
	},
	components: {
		Logo,
		'mtFiel': Field,
		'mtButton': Button,
		'mtToast': Toast
	},
	methods: {
		register() {
			this.$router.push('register')

		},
		login() {
			this.$store.dispatch('LoginByUsername', {
				user: this.userName,
				pwd: this.userPassword,
				// type: this.value
			}).then((res) => {
				if (res.data.code) {
					Toast('账号或密码错误');
				} else {
					!res.data.code ? this.$router.push('/') : ''
				}

			})

		}
	},
	computed: {
		stautus() {}

	}
}
</script>

<style lang="css" scoped="true">
.whitespace{
    height: 10px;
}
.page-msgbox-wrapper{
    padding: 0 20px;
}
.cell-wrapper{
    margin-bottom: 10px;
}
.err-msg{
    color: #e4393c;

}
</style>
